<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>首页 - 狗东电商 GD.COM</title>
    <link href="../css/before/daohang.css" rel="stylesheet" type="text/css" />
    <link href="../css/before/common.css" rel="stylesheet" type="text/css" />
    <link href="../css/before/style.css" rel="stylesheet" type="text/css" />
    <style>
        .pName {
            display: inline-block;
            text-overflow: ellipsis;
            width: 100%;
            overflow: hidden;
            white-space: nowrap;
        }
    </style>
    <script>
      function openNotice(url){
        window.open (url, '站内公告', 'height=400, width=400, top=100, left=100, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=n o, status=no');
      }
    </script>
</head>
<body>
<iframe src="/head" frameborder="0" width="100%"></iframe>
<div class="blank"></div>
<div class="block clearfix">
    <div class="AreaL">
        <!--销售排行-->
        <div class="box">
            <div class="box_2">
                <div class="top10Tit">
                    <span>销售排行</span>
                </div>
                <div class="top10List clearfix">
                    <c:forEach items="${bestSellers}" var="product" varStatus="status">
                        <ul class="clearfix">
                            <img class="iteration" src="../images/before/top_${status.count}.gif" />
                            <li class="topimg">
                                <a href="/product/detail?id=${product.id}">
                                    <img class="samllimg" alt="商品图片" src="${product.gpicture}" />
                                </a>
                            </li>
                            <li class="iteration1">
                                <a href="/product/detail?id=${product.id}">${product.gname}</a><br />
                                售价：<font class="f1">￥${product.grprice}元</font><br />
                            </li>
                        </ul>
                    </c:forEach>
                </div>
            </div>
        </div>
        <!--销售排行 end -->
        <!--人气排行-->
        <div class="blank5"></div>
        <div class="box">
            <div class="box_2">
                <div class="top10Tit">
                    <span>人气排行</span>
                </div>
                <div class="top10List clearfix">
                    <c:forEach items="${mostStared}" var="product" varStatus="status">
                        <ul class="clearfix">
                            <img class="iteration" src="../images/before/top_${status.count}.gif" />
                            <li class="topimg">
                                <a href="/product/detail?id=${product.id}">
                                    <img class="samllimg" alt="" src="${product.gpicture}" />
                                </a>
                            </li>
                            <li class="iteration1">
                                <a href="/product/detail?id=${product.id}">${product.gname}</a><br />
                                <span>售价：<font class="f1">￥${product.grprice}</font><br /></span>
                            </li>
                        </ul>
                    </c:forEach>
                </div>
            </div>
        </div>
        <!--人气排行 end -->
    </div>
    <div class="AreaR">
        <div class="AreaR">
            <div class="AreaM clearfix">
                <div id="focus">
                    <img src="../images/before/540.jpg" />
                </div>
            </div>
            <div class="AreaRR clearfix">
                <!--公告栏-->
                <div class="box">
                    <div class="box_1">
                        <div class="title_bt">
                            <h3>公告栏</h3>
                        </div>
                        <div class="post_list ared">
                            <ul>
                                <c:forEach items="${notices}" var="notice">
                                    <li>
                                        <a href="javascript:openNotice('/notice?id=${notice.id}')">${notice.ntitle}</a>
                                        <span style="color: #aaa">${notice.formattedDate}</span>
                                    </li>
                                </c:forEach>
                            </ul>
                        </div>
                    </div>
                </div>
                <!--公告栏 end-->
            </div>
        </div>
        <div class="AreaR">
            <!--最新商品列表-->
            <div class="blank5"></div>
            <div class="box">
                <div class="box_color ared">
                    <div class="title_bt">
                        <span><a href="/product/list?type=allNew&tid=0">更多</a></span>
                        <h3>最新商品</h3>
                    </div>
                    <div class="itemgood_nr clearfix">
                        <ul>
                            <c:forEach items="${newestProducts}" var="product">
                                <li>
                                    <div>
                                        <p class="pic">
                                            <a href="/product/detail?id=${product.id}">
                                                <img src="${product.gpicture}" /></a>
                                        </p>
                                        <p class="wz">
                                            <strong><a class="pName"  href="/product/detail?id=${product.id}">${product.gname}</a></strong>
                                            <em>现价:<span>￥${product.grprice}</span></em>
                                        </p>
                                    </div>
                                </li>
                            </c:forEach>
                        </ul>
                    </div>
                </div>
            </div>
            <!--最新商品列表end-->
        </div>
    </div>
</div>
</body>
</html>
